<div class="col-md-3 col-lg-3 col-sm-13 col-xs-13 aside visible-md visible-lg">
  <div class="row">
    <div class="col-md-2 col-xs-2 aside1">
      <br>
      <a class="pjaxlink" href="/"><img src="{{ site.gavatar }}" class="img-ronuded avatar" style="border-width:0px; border-color:#000"></a>
      <br><br><br><br>
      <ul class="nav nav-pills nav-stacked">
        {% for category in site.categories %}     <!-- 这里是aside1的读书、生活、科研、技术、绘画-->
         <li><a href="#{{ category | first }}" data-toggle="tab">{{ category[0] }}</a></li>
        {% endfor %}
        <li><a href="#tags" data-toggle="tab">{{ site.locals.tags }}</a></li>  
        <li><a class="pjaxlink" href="/pages/archive.html">{{ site.locals.archive }}</a></li>
        <li><a class="pjaxlink" href="/pages/about.html">{{ site.locals.about }}</a></li>  
        <!-- <li><a href="#tags" data-toggle="tab"><i class="fa fa-tags fa-lg"></i></a></li>
        <li><a class="pjaxlink" href="/pages/archive.html"><i class="fa fa-archive fa-lg"></i></a></li>
        <li><a class="pjaxlink" href="/pages/about.html"><i class="fa fa-user fa-lg"></i></a></li>
        这是原来现实汉字的代码，我改为了图标 -->
      </ul>
      <div class="aside1_bottom">
        <table class="table table-condensed">
          <tr>
            <td><a href="/pages/atom.xml" target="_blank"><i class="fa fa-rss fa-lg" style="color:#fff;"></i></a></td>
            <td><a href="mailto:{{ site.author.email }}"><i class="fa fa-envelope-o fa-lg" style="color:#fff;"></i></a></td>
          </tr>
        </table>
      </div>
    </div>
    <div class="col-md-10 col-xs-10 aside2">
      <div class="row">
        <div class="tab-content"> 
          {% for category in site.categories %} 
            <div class="tab-pane" id="{{ category[0] }}">
              <div class="list-group">
                <!--<h2 class="center">{{ category[0] }}</h2>-->     <!--原来aside2上面的大标题-->
                {% for post in category[1] %}
                  <a href="{{ post.url }}" class="list-group-item-lay pjaxlink">{{post.title}}</a>
                {% endfor %}
              </div>
            </div>
          {% endfor %}      
          <div class="tab-pane" id="tags">
            <div class="panel-group" id="accordion">
              <!--<h2 class="center">{{ site.locals.tags }}</h2>-->
              {% for tag in site.tags %} 
                <div class="panel panel-info">
                  <div class="panel-heading">
                    <h4 class="panel-title">
                      <a data-toggle="collapse" data-toggle="collapse" data-parent="#accordion" href="#{{ tag[0] }}">{{ tag[0] }}</a>
                      <span class="badge pull-right">{{ tag[1].size }}</span>
                    </h4>
                  </div>
                  <div id="{{ tag[0] }}" class="panel-collapse collapse">
                    {% for post in tag[1] %}
                      <a  href='{{ post.url }}' class="list-group-item pjaxlink">
                        {{post.title}}
                      </a>
                    {% endfor %}
                  </div>
                </div>
              {% endfor %}
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>